Uncaught TypeError: Cannot read properties of undefined (reading 'unobtrusive') caused by $.validator.unobtrusive.parse('form');

您所在的位置:网站首页 css viewport Uncaught TypeError: Cannot read properties of undefined (reading 'unobtrusive') caused by $.validator.unobtrusive.parse('form');

Uncaught TypeError: Cannot read properties of undefined (reading 'unobtrusive') caused by $.validator.unobtrusive.parse('form');

#Uncaught TypeError: Cannot read properties of undefined (reading 'unobtrusive') caused by $.validator.unobtrusive.parse('form');| 来源: 网络整理| 查看: 265

Hi @Jose Daniel Navarro Brito

First question: are Jquery and bootstrap properly set up in my project?

For this question, the _Layout.cshtml page is the master/Layout page, it typically includes common user interface elements such as the app header, navigation or menu elements, footer, stylesheets and scripts. When the content page using this layout page, it will also use the shared elements in the layout page. More detail information about layout, see Layout in ASP.NET Core.

@{ Layout = "~/Views/Shared/_Layout.cshtml"; }

So, in your scenario, since the content page already using the _Layout.cshtml page via the Layout property, there is no need to add the , and elements and the 'jquery-3.5.1.js' script reference. The modified content page should like this:

@{ Layout = "~/Views/Shared/_Layout.cshtml"; } Index span.field-validation-error { color: red; } Add Plot Plot Status Contractor Inspector Edit Delete @section scripts{ $(document).ready(function () { bindDatatable(); }); function bindDatatable() { datatable = $('#myDatatable') .DataTable({ "ajax": { "url":"Plots/Postdata", "type": "POST", "datatype": "json" }, "serverSide": true, "procesing":true, "searching":true, "order": [[1, 'asc']], "language": { "emptyTable": "No record found.", "processing": 'Loading... ' }, "columns": [ { "data": "plot", "autoWidth": true, "searchable": true }, { "data": "status","autoWidth": true,"searchable": true }, { "data": "contractor","autoWidth": true,"searchable": true }, { "data": "inspector","autoWidth": true,"searchable": true }, { "data": "idErven_Progress", "width": "50px", "render": function (data) { return 'Edit'; } }, { "data": "idErven_Progress", "width": "50px", "render": function (data) { return 'Delete'; } } ], "error": function (xhr, error, thrown) { alert("Error occurred while loading data. Please try again."); } }) $('.tablecontainer').on('click', 'a.popup', function (e) { e.preventDefault(); OpenPopup($(this).attr('href')); }) function OpenPopup(pageUrl) { var $pageContent = $(''); $pageContent.load(pageUrl, function () { $('#popupForm', $pageContent).removeData('validator'); $('#popupForm', $pageContent).removeData('unobtrusiveValidation'); $.validator.unobtrusive.parse('form'); }); $dialog = $('') .html($pageContent) .dialog({ draggable: false, autoOpen: false, resizable: false, model: true, title: 'Popup Dialog', height: 550, width: 600, close: function () { $dialog.dialog('destroy').remove(); } }) $('.popupWindow').on('submit', '#popupForm', function (e) { var url = $('#popupForm')[0].action; $.ajax({ type: "POST", url: url, data: $('#popupForm').serialize(), success: function (data) { if (data.status) { $dialog.dialog('close'); oTable.ajax.reload(); } } }) e.preventDefault(); }) $dialog.dialog('open'); } } }

Second question; Are all these references correct and necessary ?

After removing the duplicate JQuery reference, the others reference seems are correct.

Uncaught TypeError: Cannot read properties of undefined (reading 'unobtrusive')

About this issue, please check the wwwroot\lib\ folder, make sure the above jquery validate files exist and the file path is correct, and then try to use F12 developer tool to check whether these files load success or not?

$pageContent.load(pageUrl, function () { $('#popupForm', $pageContent).removeData('validator'); $('#popupForm', $pageContent).removeData('unobtrusiveValidation'); $.validator.unobtrusive.parse('form'); });

From your code, it seems that you want to trigger the client-side validation and the form id is "popupForm", if that is the case, when enable form validation, you should also use the "popupForm", instead of "form". So, try to modify your code as below:

$pageContent.load(pageUrl, function () { $('#popupForm', $pageContent).removeData('validator'); $('#popupForm', $pageContent).removeData('unobtrusiveValidation'); $.validator.unobtrusive.parse('#popupForm'); //enable form validation. $('#popupForm').validate().form(); //check the validation result. });

You can also refer the following sample on my side:

If the answer is the right solution, please click "Accept Answer" and kindly upvote it. If you have extra questions about this answer, please click "Comment". Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread. Best regards, Dillion



【本文地址】


今日新闻


推荐新闻


CopyRight 2018-2019 办公设备维修网 版权所有 豫ICP备15022753号-3